<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>资金流水</cite></a>
  </div>
</div>
<div class="layui-fluid">
  <div class="layui-card">
    <div class="layui-tab layui-tab-brief">
      <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
          <div class="layui-row">
            <div class="layui-form" style="margin-bottom: 10px;">
              <div class="layui-form-item" style="margin:0;">
                <div class="layui-input-inline">
                  <input type="text" name="startTime" id="startTime" autocomplete="off" placeholder="开始时间" class="layui-input">
                </div>
                <div class="layui-input-inline">
                  <input type="text" name="endTime" id="endTime" autocomplete="off" placeholder="结束时间" class="layui-input">
                </div>
                <div class="layui-input-inline">
                  <input type="text" name="username" id="username" autocomplete="off" placeholder="用户名" class="layui-input">
                </div>
                <div class="layui-input-inline">
                  <input type="text" name="orderNo" id="orderNo" autocomplete="off" placeholder="业务订单号" class="layui-input">
                </div>
                <div class="layui-input-inline">
                  <select name="bizItem" id="bizItem" lay-search="">
                    <option value="14">可结算余额</option>
                    <option value="10">余额</option>
                    <option value="12">冻结金额</option>
                    <option value="13">保证金</option>
                  </select>
                </div>
                <div class="layui-input-inline">
                  <select name="fundDirection" id="fundDirection" lay-search="">
                    <option value="">变动方向</option>
                    <option value="1">增加</option>
                    <option value="2">减少</option>
                  </select>
                </div>
                <div class="layui-input-inline">
                  <select name="bizType" id="bizType" lay-search="">
                    <option value="">业务类型</option>
                    <option value="1">收款</option>
                    <option value="2">提现</option>
                    <option value="3">调账</option>
                    <option value="4">充值</option>
                    <option value="5">差错处理</option>
                  </select>
                </div>
                <div class="layui-input-inline" style="width: 250px;">
                  <button id="search" class="layui-btn" data-type="reload">搜索</button>
                </div>
                <div class="layui-form-item" style="margin-top: 5px;">
                  <blockquote class="layui-elem-quote" id="amountTip">
                    总笔数: <sapn id="totalCount" style="color: dodgerblue; margin-right: 10px;"></sapn>
                    总金额: <span id="totalAmount" style="color: blueviolet; margin-right: 10px;"></span>
                    增加金额数: <span id="addTotalCount" style="color: green; margin-right: 10px;"></span>
                    增加金额: <span id="addTotalAmount" style="color: darkgreen; margin-right: 10px;"></span>
                    减少金额数: <span id="subTotalCount" style="color: red; margin-right: 10px;"></span>
                    减少金额: <span id="subTotalAmount" style="color: darkred; margin-right: 10px;"></span>
<!--                    剩余金额: <span id="surplusTotalAmount" style="color: darkred; margin-right: 10px;"></span>-->
                  </blockquote>
                </div>
              </div>
            </div>
          </div>
          <table id="Code_QRCode_dataAll" lay-filter="Code_QRCode_dataAll"></table>
        </div>
      </div>
    </div>
  </div>
</div>

<script type="text/html" id="operateBar">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">详情</a>
</script>

<script>
layui.use(['admin', 'table', 'util', 'laydate'], function(){
  var $ = layui.$
  ,admin = layui.admin
  ,table = layui.table
  ,element = layui.element
  ,laydate = layui.laydate
  ,form = layui.form;

  element.render('breadcrumb', 'breadcrumb');

  var tplAmount = function (d) {
    if(d.fundDirection == 1) {
      return "<span style='color: darkgreen'>+" + d.amount + "</span>";
    }else if(d.fundDirection == 2) {
      return "<span style='color: orangered'>" + d.amount + "</span>";
    }
  };

  var tplBizType = function (d) {
    if (d.bizType == 1) {
      return "<span style='color: orange'>收款</span>";
    } else if (d.bizType == 2) {
      return "<span style='color: darkgreen'>提现</span>";
    } else if (d.bizType == 3) {
      return "<span style='color: darkgreen'>调账</span>";
    } else if (d.bizType == 4) {
      return "<span style='color: darkgreen'>充值</span>";
    } else if (d.bizType == 5) {
      return "<span style='color: darkgreen'>差错处理</span>";
    }
  };

  var tplBizItem = function (d) {
    if (d.bizItem == 10) {
      return "余额";
    } else if (d.bizItem == 14) {
      return "可结算余额";
    } else if (d.bizItem == 12) {
      return "冻结金额";
    } else if (d.bizItem == 13) {
      return "保证金";
    }
  };

  $.setCountResult = function(startTime, endTime, username, orderNo, bizItem, bizType, fundDirection) {
    admin.req({
      type: 'get',
      url: layui.setter.baseUrl + '/accountHistory/count',
      data: {
        startTime : startTime,
        endTime : endTime,
        username : username,
        orderNo : orderNo,
        bizItem : bizItem,
        bizType : bizType,
        fundDirection : fundDirection,
      },
      error: function(err){
        layer.alert(JSON.stringify(err.field), {
          title: '错误提示'
        })
      },
      success: function(res){
        if(res.code == 0){
          $('#totalCount').html(res.data.totalCount);
          $('#totalAmount').html("￥" + res.data.totalAmount);
          $('#addTotalCount').html(res.data.addTotalCount);
          $('#addTotalAmount').html("￥" + res.data.addTotalAmount);
          $('#subTotalCount').html(res.data.subTotalCount);
          $('#subTotalAmount').html("￥" + res.data.subTotalAmount);
          $('#surplusTotalAmount').html("￥" + res.data.surplusTotalAmount);
        }
      }
    });
  };

  var dateTime = new Date();
  dateTime.setDate(dateTime.getDate()-1);
  dateTime = new Date(dateTime);
  var startTimeDefault = layui.util.toDateString(dateTime, "yyyy-MM-dd 00:00:00")
  $.setCountResult(startTimeDefault);

  //用户列表
  table.render({
    elem: '#Code_QRCode_dataAll'
    ,url: layui.setter.baseUrl + '/accountHistory/list' //用户列表接口
    ,where: {
        access_token: layui.data(layui.setter.tableName).access_token,
        startTime : startTimeDefault,
        bizItem: $("#bizItem").val()
    }
    ,id: 'tableReload'
    ,page: true
    ,cols: [[
      {field: 'username', title: '用户名'}
      ,{field: 'orderNo', title: '业务订单号', width: 210}
      ,{field: 'orderAmount',title: '订单金额'}
      ,{field: 'beforeAmount', title: '变更前'}
      ,{field: 'amount', title: '变动金额', templet: tplAmount}
      ,{field: 'afterAmount', title: '变动后'}
      ,{field: 'userProfit', title: '收益'}
      ,{field: 'rate', title: '费率', templet: '<div>{{ (d.rate * 100).toFixed(2) }}%</div>'}
      ,{field: 'bizItem', title: '账户类型', templet: tplBizItem}
      ,{field: 'bizType', title: '业务类型', templet: tplBizType}
      // ,{field: 'fee',title: '手续费'}
      ,{field: 'createTime', title: '创建时间', width:130, templet: '<div>{{ layui.util.toDateString(d.createTime, "MM-dd HH:mm:ss") }}</div>'}
      // ,{field: 'edit', title: '操作', width: 100, toolbar: '#operateBar' }
    ]]
    ,skin: 'line'
  });

  //监听工具条
  table.on('tool(Code_QRCode_dataAll)', function (obj) {
    var data = obj.data;
    if (obj.event === 'detail') {
      location.hash = "/accountHistory/detail/id=" + data.id;
    } else if (obj.event === 'edit') {
      location.hash = "/accountHistory/edit/id=" + data.id;
    }
  });

  // 搜索
  var $ = layui.$, active = {
    reload: function(){
      var startTime = $('#startTime').val();
      var endTime = $('#endTime').val();
      var username = $('#collName').val();
      var orderNo = $('#orderNo').val();
      var bizItem = $('#bizItem').val();
      var bizType = $('#bizType').val();
      var fundDirection = $('#fundDirection').val();

      $.setCountResult(startTime, endTime, username, orderNo, bizItem, bizType, fundDirection);

      //执行重载
      table.reload('tableReload', {
        page: {
          curr: 1 //重新从第 1 页开始
        }
        ,where: {
          startTime : startTime,
          endTime : endTime,
          username : username,
          orderNo : orderNo,
          bizItem : bizItem,
          bizType : bizType,
          fundDirection : fundDirection,
        }
      });
    }
  };
  $('#search').on('click', function() {
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });

  laydate.render({
    elem: '#startTime'
    ,type: 'datetime'
    ,value: startTimeDefault
    ,format: 'yyyy-MM-dd HH:mm:ss'
  });

  laydate.render({
    elem: '#endTime'
    ,type: 'datetime'
    ,format: 'yyyy-MM-dd HH:mm:ss'
  });
  // 渲染表单
  form.render();
});
</script>